//@flow
import React, { Component } from 'react';
import { 
    View,
    ViewStyle,
 } from 'react-native';
import { getSafeAreaHeightByPosition } from '../util/constant/size';
/**
 * 安全区控制组件
 */


export const safeAreaHOC = (ele:React.Component,position:'top'|'bottom') => {
    let paddingStyle:ViewStyle = position === 'top' ? 
                                 {paddingTop:getSafeAreaHeightByPosition(position)}:
                                 {paddingBottom:getSafeAreaHeightByPosition(position)}
    return class Wrapper extends ele {
        render(){
            return (
                <View style={[paddingStyle,{backgroundColor:this.props.style==undefined?'white':this.props.style.backgroundColor}]}>
                    {super.render()}
                </View>
            )
        }
    }
}